import React from "react";
import {Button, Grid} from "@material-ui/core";
import {AddRounded} from "@material-ui/icons";

import {EnhancedTable, Toolbar} from "../../../shared/components";

const ViewAllPlan = ({onAdd, onRowClick, ...props}) => {

    return (
        <Grid container spacing={4}>
            <Toolbar
                title="Planning"
                actions={
                    <React.Fragment>
                        <Button
                            variant="contained" color="primary"
                            startIcon={<AddRounded/>} onClick={onAdd}
                        >
                            Add Plan
                        </Button>
                    </React.Fragment>
                }
            />

            <Grid item xs={12}>
                <EnhancedTable
                    title={"Plan List"}
                    schema={[
                        {id: 'id', label: 'Id', hidden: true},
                        {id: 'tslOrder', label: 'TSL Order', sort: true},
                        {id: 'date', label: 'Date', sort: true},
                        {id: 'truck', label: 'Truck Reg.', sort: true},
                        {id: 'route', label: 'Trip (To & From)', sort: true},
                        {id: 'contractor', label: 'Name of Contractor', sort: true},
                        {id: 'loadType', label: 'Type of Load', sort: true},
                        {id: 'podNumber', label: 'POD Number', sort: true},
                        {id: 'deliveryNo', label: 'Delivery Note No.', sort: true},
                        {id: 'weight', label: 'Load Weight (ton)', sort: true},
                        {id: 'rate', label: 'Rate', sort: true}
                    ]}
                    data={[]}
                    rowsPerPage={50}
                    onRowClick={onRowClick}
                />
            </Grid>
        </Grid>
    );
};

export default ViewAllPlan;
